<!--生成视频/成片-->
<template>
  <ele-modal
    width="460px"
    :visible="visible"
    :append-to-body="true"
    :close-on-click-modal="true"
    custom-class="ele-dialog-form"
    title="生成视频"
    @update:visible="updateVisible"
  >
    <el-form ref="form" :model="form" label-width="102px">
      <el-form-item label="生成数量:" prop="name">
        <el-input
          oninput="value=value.replace(/[^0-9]/g,'')"
          clearable
          :maxlength="20"
          v-model.number="form.maximumCount"
          placeholder="请输入生成数量"
        />
        <div v-if="videoItem && isLongVideo==false">温馨提示：最大可剪辑数量为{{maxNum || 0}}</div>
      </el-form-item>

      <el-form-item label="视频时长" prop="name"  class="check-star" v-if="isLongVideo==true">
        <el-select
          clearable
          v-model="form.duration"
          placeholder="请选择视频时长"
          class="ele-fluid"
        >
          <!--视频时长 12 15 18 21 默认15s-->
          <el-option label="12s" value="12" />
          <el-option label="15s" value="15" />
          <el-option label="18s" value="18" />
          <el-option label="21s" value="21" />
        </el-select>
      </el-form-item>

    </el-form>
    <template v-slot:footer>
      <el-button @click="updateVisible(false)">取消</el-button>
      <el-button type="primary" :loading="loading" @click="save">
        保存
      </el-button>
    </template>
  </ele-modal>
</template>

<script>
  import {submitDiyJob, submitImageJob, submitProjectJob} from "@/api/explosiveCode/releaseActivity";
  import { getGenerateVideo} from "@/api/creatCenter/longVideo";
  export default {
    name: "generate-pieces",
    props:{
      // 弹窗是否打开
      visible: Boolean,
    },
    data(){
      return{
        // 表单数据
        form: {
          duration:'15',
        },
        loading:false,
        videoItem:{},
        maxNum:0,
        isLongVideo:false
      }
    },
    methods: {
      //montageCount：是查询出来的该文件夹下，已生成的视频数
      show(item,montageCount){
        this.videoItem=item //最大可剪辑数量
        //montageCount==-1，代表是创作中心——长视频，不需要限制剪辑数量，以及换接口
        if(montageCount==-1){
          this.isLongVideo=true
        }
        else{
          this.isLongVideo=false
          this.maxNum=Number(item.max)-Number(montageCount)
          this.maxNum=this.maxNum<0?0:this.maxNum
          console.log("进入生成视频show========",item)
        }
      },
      // 保存视频剪辑数量
      save(){
        if(!this.form.maximumCount || this.form.maximumCount<=0){
          this.$message.error('请输入生成数量')
          return
        }
        if(this.isLongVideo==false){
          if(this.maxNum<=0){
            this.$message.error('暂无剪辑数量，无法生成视频')
            return
          }
          if(this.form.maximumCount>this.maxNum){
            this.$message.error('已超过最大可剪辑数量')
            return
          }
        }
        Object.assign(this.form, {
          id: this.videoItem.id, // 剪辑工程主键ID
          username: this.$store.state.user.info.username
        })
        let saveApi=''
        if(this.isLongVideo==false){
          delete this.form.duration
          // 1脚本剪辑 * 2自定义剪辑 * 3图文剪辑
          // <!-- * 1脚本剪辑 =AI剪辑 * 2自定义剪辑=口播剪辑 * 3图文剪辑-->
          saveApi = this.videoItem.type === 1 ? submitProjectJob : this.videoItem.type === 2 ? submitDiyJob : submitImageJob
        }
        else{
          saveApi = getGenerateVideo
        }
        this.loading=true
        saveApi(this.form)
          .then((data) => {
            this.$message.success('生成视频成功')
            this.$emit('query');
            this.updateVisible(false)
          })
          .catch((e) => {
            this.loading=false
            this.$message.error(e);
          });
      },
      /* 更新 visible */
      updateVisible(value) {
        this.loading=false
        delete this.form.maximumCount
        this.$emit('update:visible', value);
      }
    },
  }
</script>

<style scoped>

</style>
